
$(function () {
    //载入头部内容
    $("header").load("header.html")
    //初始化 前端的文章信息
    $.get("http://localhost:5500/data/list.json", function (data) {

        for (var i = 0; i < data.前端.length; i++) {
            $("#log").append(`            <div class="content-left-or">
        <div class="or-fir">
            <div class="or-fir-left">
                <a href="./blog.html?id=${data.前端[i].id}">
                    <h4 class="log-title"></h4>
                </a>
                <span class="log-desc"></span>
            </div>

            <div class="or-fir-right"><img alt="" class="log-src"></div>
        </div>
    </div>`)

            $(".log-title").eq(i).text(data.前端[i].title)
            $(".log-desc").eq(i).text(data.前端[i].desc)
            $(".log-src").eq(i).attr("src", data.前端[i].imgsrc);
        }
    })

    $(".list-group-item").click(function () {
        let name = $(this).text()
        $.get("http://localhost:5500/data/list.json", function (data) {
            $("#log").empty()

            if (Array.isArray(data[name])) {
                for (var i = 0; i < data[name].length; i++) {
                    $("#log").append(`            <div class="content-left-or">
                <div class="or-fir">
                    <div class="or-fir-left">
                        <a href="./blog.html?id=${data[name][i].id}">
                            <h4 class="log-title"></h4>
                        </a>
                        <span class="log-desc"></span>
                    </div>

                    <div class="or-fir-right"><img alt="" class="log-src"></div>
                </div>
                </div>`)

                    $(".log-title").eq(i).text(data[name][i].title)
                    $(".log-desc").eq(i).text(data[name][i].desc)
                    $(".log-src").eq(i).attr("src", data[name][i].imgsrc);
                }
            }else{
                $("#log").append("该栏目正在建设中，先去其他栏目下看看吧！")
            }
        })
    })
})